<template>
  <main class="container">
    <div class="content" v-if="!!getToken()">
      <van-card :thumb="userStore.avatar" class="user_card" @click="router.push('/change-password')">
        <template #title>
          <p class="user_name">{{ userStore.name }}</p>
        </template>
        <template #desc>
          <p class="user_desc">{{ userStore.sex == 1 ? "男" : "女" }}</p>
        </template>
        <template #tags>
          <p class="user_sign">{{ userStore.sign }}</p>
        </template>
      </van-card>
      <div style="background: #f0f0f0; padding: 10px">
        <van-cell
          icon="logistics"
          title="我的收货地址"
          is-link
          to="/address-list"
        />
        <van-cell icon="orders-o" title="我的订单" is-link to="/order" />
        <van-cell
          icon="description"
          title="我的文章"
          is-link
          to="/my-artical"
        />
        <van-cell icon="star-o" title="我的收藏" is-link to="/my-collection" />
        <van-cell icon="good-job-o" title="我的点赞" is-link to="/thumbs-up" />
      </div>
      <div class="logout_box">
        <van-button class="logout_btn" type="warning" @click="Logout"
          >退出登录</van-button
        >
      </div>
    </div>
    <div v-else>
      <van-empty description="请先登录">
        <van-button
          @click="router.replace('/login')"
          round
          type="primary"
          style="width: 200px"
          >去登录</van-button
        >
      </van-empty>
    </div>
  </main>
</template>
<script setup>
import useInfo from '@/stores/useInfo'
import {logout}  from '@/api/user'
import {getToken,removeToken} from '@/utils/cookie'
import {useRouter} from 'vue-router'
import { showConfirmDialog, showSuccessToast } from "vant";
let userStore=useInfo()
let router = useRouter()
let Logout = ()=>{
  showConfirmDialog({
    title: "确认登出",
    message: "是否确认退出登录",
  })
    .then(async () => {
      // 确定 执行登出
      await logout({ token: getToken() });
      //清除token
      removeToken();
      showSuccessToast("登出成功");
      router.replace("/login");
    })
    .catch(() => {
      // on cancel
    });
}

</script>